<template>
  <div class="rightBodyContent">
    <div class="rightBodyContent-in">
      <div class="tab-table-line">
        <el-tabs v-model="activeName" type="card">
          <el-tab-pane :label="item.name" :name="item.id" v-for="item in tabList" :key="item.id"></el-tab-pane>
        </el-tabs>
        <el-button size="small" type="primary" plain class="excelDownload" @click="excelDownLoadVisible=true">全日健康表格总览</el-button>
      </div>
      <list v-if="Number(activeName)==1"></list>
      <noonlist v-if="Number(activeName)==3"></noonlist>
      <settingOption v-if="Number(activeName)==2"></settingOption>
      <allDay v-if="Number(activeName)==4"></allDay>
      <excelModelDown :visible.sync="excelDownLoadVisible"></excelModelDown>
    </div>
  </div>
</template>

<script>
import settingOption from "./components/settingOption";
import list from "./components/list";
import noonlist from "./components/noonlist";
import allDay from "./components/allDay";
import excelModelDown from "./components/excelModelDown";

export default {
  components: {
    settingOption,
    list,
    noonlist,
    allDay,
    excelModelDown
  },
  data() {
    return {
      excelDownLoadVisible: false,
      tabList: [
        {
          name: '晨检记录',
          id: '1'
        },
        {
          name: '午检异常记录',
          id: '3'
        },
        {
          name: '全日健康',
          id: '4'
        },
        {
          name: '晨检事项',
          id: '2',
        }
      ],
      activeName: '1',
    }
  },
  watch: {},
  created() {
  },
  methods: {},
  mounted() {
  },
}
</script>
<style>
.lead-list {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fddeae;
  margin-bottom: 5px;
  border-radius: 2px;
  padding: 5px 0;
}

.lead-list:last-child {
  margin-bottom: 0;
}

.lead-list span {
  margin-right: 30px;
}
.tab-table-line{
  position: relative;
}
.excelDownload{
  position: absolute;
  top: 5px;
  right: 0;
}
</style>

